import { createApp } from "./main"
import { renderToString } from "@vue/server-renderer"
import serialize from "serialize-javascript";
export async function render(url, manifest) {
  const { app, router } = createApp();
  // 去掉base路由才能正常访问
  router.push(url.replace(router.options.history.base, ""));
  // 需要手动触发,详细见：https://next.router.vuejs.org/zh/guide/migration/#%E5%B0%86-onready-%E6%94%B9%E4%B8%BA-isready
  await router.isReady();
  // 执行各个路由下的 asyncData 函数
  await invokeAsyncData({  route: router.currentRoute.value });

  const ctx = {};

  const html = await renderToString(app, ctx);
  const preloadLinks = renderPreloadLinks(ctx.modules, manifest);

  return { html, preloadLinks, }
}

function invokeAsyncData({  route }) {
  return Promise.allSettled(
    route.matched.map(({ components }) => {
      let asyncData = components.default.asyncData || false;
      return asyncData && asyncData({  route });
    })
  );
}

function renderPreloadLinks(modules, manifest) {
  let links = "";
  const seen = new Set();
  modules.forEach((id) => {
    const files = manifest[id];
    if (files) {
      files.forEach((file) => {
        if (!seen.has(file)) {
          seen.add(file);
          links += renderPreloadLink(file);
        }
      });
    }
  });
  return links;
}

function renderPreloadLink(file) {
  console.log(file,'file');
  if (file.endsWith(".js")) {
    return `<link rel="modulepreload" crossorigin href="${file}">`;
  } else if (file.endsWith(".css")) {
    return `<link rel="stylesheet" href="${file}">`;
  } else {
    // TODO
    return "";
  }
}
